<template>
  <div class="home">
    <SideBar />
    <div class="playlist">
      <PlayListDetail />
      <PlayLists />
      <Player />
    </div>
  </div>
</template>

<script>
import SideBar from "../components/SideBar.vue";
import PlayListDetail from "@/components/PlayListDetail.vue";
import PlayLists from "@/components/PlayLists.vue";
import Player from "@/components/Player.vue";

export default {
  name: "MyHome",
  components: {
    PlayListDetail,
    PlayLists,
    Player,
    SideBar,
  },
};
</script>

<style>
body {
  background: rgb(240, 240, 250);
}
.playlist {
  position: relative;
  background: #fff;
  width: 78vw;
  /* height: 98vw; */
  left: 22vw;
  top: 2vh;
}
</style>